<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>学生宿舍管理系统</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    <div class="container">
        <header class="main-header">
            <h1>学生宿舍管理系统</h1>
            <div class="user-info">
                <span>欢迎, 管理员</span>
                <a href="#" class="logout-btn">退出</a>
            </div>
        </header>

        <div class="main-content">
            <nav class="sidebar">
                <div class="menu-group">
                    <h3>基础管理</h3>
                    <ul>
                        <li>
                            <a href="javascript:void(0)" class="active" onclick="showSection('buildings')">
                                <i class="icon building-icon"></i>宿舍楼管理
                            </a>
                        </li>
                        <li>
                            <a href="javascript:void(0)" onclick="showSection('rooms')">
                                <i class="icon room-icon"></i>房间管理
                            </a>
                        </li>
                        <li>
                            <a href="javascript:void(0)" onclick="showSection('students')">
                                <i class="icon student-icon"></i>学生管理
                            </a>
                        </li>
                    </ul>
                </div>

                <div class="menu-group">
                    <h3>日常管理</h3>
                    <ul>
                        <li>
                            <a href="javascript:void(0)" onclick="showSection('hygiene')">
                                <i class="icon hygiene-icon"></i>卫生检查
                            </a>
                        </li>
                        <li>
                            <a href="javascript:void(0)" onclick="showSection('discipline')">
                                <i class="icon discipline-icon"></i>违纪记录
                            </a>
                        </li>
                    </ul>
                </div>
            </nav>

            <main class="content">
                <!-- 宿舍楼管理部分 -->
                <section id="buildings" class="section">
                    <div class="section-header">
                        <h2>宿舍楼管理</h2>
                        <div class="section-actions">
                            <button class="btn btn-primary" onclick="BuildingManager.showAddForm()">
                                <i class="icon add-icon"></i>添加宿舍楼
                            </button>
                        </div>
                    </div>
                    <div class="card-grid" id="buildingList"></div>
                </section>

                <!-- 房间管理部分 -->
                <section id="rooms" class="section room-management hidden">
                    <div class="section-header">
                        <h2>房间管理</h2>
                        <div class="section-actions">
                            <select id="buildingSelect" class="select-control">
                                <option value="">选择宿舍楼</option>
                            </select>
                            <button class="btn btn-primary" onclick="RoomManager.showAddForm()">
                                <i class="icon add-icon"></i>添加房间
                            </button>
                        </div>
                    </div>
                    <div class="room-grid" id="roomList"></div>
                </section>

                <!-- 学生管理部分 -->
                <section id="students" class="section hidden">
                    <div class="section-header">
                        <h2>学生管理</h2>
                        <div class="section-actions">
                            <button class="btn btn-primary" onclick="StudentManager.showAddForm()">
                                <i class="icon add-icon"></i>添加学生
                            </button>
                        </div>
                    </div>
                    <div class="card-grid" id="studentList"></div>
                </section>

                <!-- 卫生检查部分 -->
                <section id="hygiene" class="section hygiene-management hidden">
                    <div class="section-header">
                        <h2>卫生检查</h2>
                        <div class="section-actions">
                            <select id="hygieneBuilding" class="select-control">
                                <option value="">选择宿舍楼</option>
                            </select>
                            <button class="btn btn-primary" onclick="HygieneManager.showAddForm()">
                                <i class="icon add-icon"></i>添加检查记录
                            </button>
                        </div>
                    </div>
                    <div class="hygiene-grid" id="hygieneList"></div>
                </section>

                <!-- 违纪记录部分 -->
                <section id="discipline" class="section discipline-management hidden">
                    <div class="section-header">
                        <h2>违纪记录</h2>
                        <div class="section-actions">
                            <select id="disciplineBuilding" class="select-control">
                                <option value="">选择宿舍楼</option>
                            </select>
                            <div class="search-box">
                                <input type="text" id="studentSearch" placeholder="输入学号或姓名搜索" class="search-input">
                            </div>
                            <button class="btn btn-primary" onclick="DisciplineManager.showAddForm()">
                                <i class="icon add-icon"></i>添加违纪记录
                            </button>
                        </div>
                    </div>
                    <div class="discipline-grid" id="disciplineList"></div>
                </section>
            </main>
        </div>
    </div>

    <div class="modal-container">
        <!-- 添加宿舍楼的表单 -->
        <div id="addBuildingModal" class="modal">
            <div class="modal-content">
                <button type="button" class="modal-close" onclick="hideModal('addBuildingModal')"></button>
                <h3>添加宿舍楼</h3>
                <form id="addBuildingForm">
                    <div class="form-group">
                        <label>楼栋名称：</label>
                        <input type="text" name="buildingName" required>
                    </div>
                    <div class="form-group">
                        <label>楼层数：</label>
                        <input type="number" name="floors" required min="1">
                    </div>
                    <div class="form-group">
                        <label>描述：</label>
                        <textarea name="description"></textarea>
                    </div>
                    <div class="form-actions">
                        <button type="submit" class="btn btn-primary">
                            <i class="icon add-icon"></i>保存
                        </button>
                        <button type="button" class="btn btn-secondary" onclick="hideModal('addBuildingModal')">取消</button>
                    </div>
                </form>
            </div>
        </div>

        <!-- 编辑宿舍楼的表单 -->
        <div id="editBuildingModal" class="modal">
            <div class="modal-content">
                <button type="button" class="modal-close" onclick="hideModal('editBuildingModal')"></button>
                <h3>编辑宿舍楼</h3>
                <form id="editBuildingForm">
                    <input type="hidden" name="id">
                    <div class="form-group">
                        <label>楼栋名称：</label>
                        <input type="text" name="buildingName" required>
                    </div>
                    <div class="form-group">
                        <label>楼层数：</label>
                        <input type="number" name="floors" required min="1">
                    </div>
                    <div class="form-group">
                        <label>描述：</label>
                        <textarea name="description"></textarea>
                    </div>
                    <div class="form-actions">
                        <button type="submit" class="btn btn-primary">
                            <i class="icon edit-icon"></i>保存
                        </button>
                        <button type="button" class="btn btn-secondary" onclick="hideModal('editBuildingModal')">取消</button>
                    </div>
                </form>
            </div>
        </div>

        <!-- 添加房间的模态框 -->
        <div id="addRoomModal" class="modal">
            <div class="modal-content">
                <button type="button" class="modal-close" onclick="hideModal('addRoomModal')"></button>
                <form id="addRoomForm" class="add-room-form">
                    <h3 class="form-title">添加新房间</h3>
                    <input type="hidden" name="buildingId" id="roomFormBuildingId">
                    <div class="form-group">
                        <label class="form-label">房间号</label>
                        <div class="form-input-group">
                            <input type="text" name="roomNumber" class="form-input" required 
                                   placeholder="例如：101">
                            <div class="form-input-hint">请输入3-4位数字</div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="form-label">容量</label>
                        <div class="form-input-group">
                            <input type="number" name="capacity" class="form-input" required 
                                   min="1" max="8" value="4">
                            <div class="form-input-hint">每个房间可容纳1-8人</div>
                        </div>
                    </div>
                    <div class="form-actions">
                        <button type="submit" class="btn btn-primary">
                            <i class="icon add-icon"></i>保存
                        </button>
                        <button type="button" class="btn btn-secondary" onclick="hideModal('addRoomModal')">取消</button>
                    </div>
                </form>
            </div>
        </div>

        <!-- 添加学生的模态框 -->
        <div id="addStudentModal" class="modal">
            <div class="modal-content">
                <button type="button" class="modal-close" onclick="hideModal('addStudentModal')"></button>
                <form id="addStudentForm" class="add-student-form">
                    <h3 class="form-title">添加新学生</h3>
                    <div class="form-group">
                        <label class="form-label">学号</label>
                        <input type="text" name="studentNumber" class="form-input" required>
                    </div>
                    <div class="form-group">
                        <label class="form-label">姓名</label>
                        <input type="text" name="name" class="form-input" required>
                    </div>
                    <div class="form-group">
                        <label class="form-label">性别</label>
                        <select name="gender" class="form-input" required>
                            <option value="">请选择性别</option>
                            <option value="男">男</option>
                            <option value="女">女</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label class="form-label">联系电话</label>
                        <input type="tel" name="phone" class="form-input">
                    </div>
                    <div class="form-group">
                        <label class="form-label">宿舍楼</label>
                        <select name="buildingId" class="form-input" required onchange="StudentManager.loadRoomSelect(this.value)">
                            <option value="">请选择宿舍楼</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label class="form-label">房间</label>
                        <select name="roomId" class="form-input" required>
                            <option value="">请先选择宿舍楼</option>
                        </select>
                    </div>
                    <div class="form-actions">
                        <button type="submit" class="btn btn-primary">
                            <i class="icon add-icon"></i>保存
                        </button>
                        <button type="button" class="btn btn-secondary" onclick="hideModal('addStudentModal')">取消</button>
                    </div>
                </form>
            </div>
        </div>

        <!-- 添加卫生检查记录的模态框 -->
        <div id="addHygieneModal" class="modal">
            <div class="modal-content">
                <button type="button" class="modal-close" onclick="hideModal('addHygieneModal')"></button>
                <form id="addHygieneForm" class="add-hygiene-form">
                    <h3 class="form-title">添加卫生检查记录</h3>
                    <input type="hidden" name="roomId" id="hygieneFormRoomId">
                    <div class="form-group">
                        <label class="form-label">评分 (0-100)</label>
                        <input type="number" name="score" class="form-input" required min="0" max="100">
                    </div>
                    <div class="form-group">
                        <label class="form-label">备注</label>
                        <textarea name="comments" class="form-input" rows="3"></textarea>
                    </div>
                    <div class="form-actions">
                        <button type="submit" class="btn btn-primary">
                            <i class="icon add-icon"></i>保存
                        </button>
                        <button type="button" class="btn btn-secondary" onclick="hideModal('addHygieneModal')">取消</button>
                    </div>
                </form>
            </div>
        </div>

        <!-- 添加违纪记录的模态框 -->
        <div id="addDisciplineModal" class="modal">
            <div class="modal-content">
                <button type="button" class="modal-close" onclick="hideModal('addDisciplineModal')"></button>
                <form id="addDisciplineForm" class="add-discipline-form">
                    <h3 class="form-title">添加违纪记录</h3>
                    <div class="form-group">
                        <label class="form-label">学生</label>
                        <select name="studentId" class="form-input" required>
                            <option value="">请先搜索学生</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label class="form-label">违纪描述</label>
                        <textarea name="description" class="form-input" rows="3" required></textarea>
                    </div>
                    <div class="form-actions">
                        <button type="submit" class="btn btn-primary">
                            <i class="icon add-icon"></i>保存
                        </button>
                        <button type="button" class="btn btn-secondary" onclick="hideModal('addDisciplineModal')">取消</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <script src="js/modal.js"></script>
    <script src="js/api.js"></script>
    <script src="js/debug.js"></script>
    <script src="js/building.js"></script>
    <script src="js/room.js"></script>
    <script src="js/student.js"></script>
    <script src="js/hygiene.js"></script>
    <script src="js/main.js"></script>
    <script src="js/discipline.js"></script>
    <script>
        // 添加全局错误处理
        window.onerror = function(msg, url, line, col, error) {
            Debug.error('Global error:', { msg, url, line, col, error });
            return false;
        };
    </script>
</body>
</html> 